font{
	font-family:微软雅黑, Arial, Helvetica, sans-serif;
}
.border-bottom{
	border-bottom:1px solid #ccc;	
}
.white{
	background:white;
}

nav{
	.logo{
		height:45px;		
		margin-top:-9px;
		font-size:24px;
		.logo-img{
			height:40px;
		}	
	}
	
}
.masthead{
	margin-top: 51px;
	.avatar{
		width:140px;
		height:140px;
	}
	.banner{
		.left{
			text-align:right;
			.heart{
				font-size:30px;
				color:#FE9CBA;
			}
		}
		.right{
			p{
				font-family:"微软雅黑";
			}
		}
	}
}

.main{
	.left{
		padding:0px 20px 20px 20px;
		.title{
			font-size:20px;
			border-bottom:3px solid #DB6D4C;
			font-family:"微软雅黑";
		}	
		article{
			padding:30px 0px;
			.article-left{
				text-align:center;	
				overflow:hidden;
				z-index:2;
				img{
					height:135px;
					width:190px;
					max-height:135px;
					max-width:190px;
					overflow:hidden;
					cursor: pointer;    
	      			transition-duration:0.5s;
	             	z-index:1;
				}		
				img:hover{    
			       	transform: scale(1.1);  
					-webkit-transform: scale(1.1);
					-moz-transform: scale(1.1); 
					-ms-transform: scale(1.1);
					-o-transform: scale(1.1); 
			  	}	
			}
			.article-right{
				.article-title{
					font-size:18px;
					font-family:"微软雅黑";
					font-weight:bold;
					color:#474645;
				}
				.brief{
					padding:10px 0px 6px;
					font-family:微软雅黑, Arial, Helvetica, sans-serif;
					color:#756F71;
					font-size:13px;
					line-height:22px;
				}
				footer{
					font{
						font-size:13px;
					}
					.tag{
						color:#F8A8A8;
					}
					.tag-text{
						color:#759B08;
					}

					.user{
						color:#C8C8A9
					}
					.user-text{
						color:#838383;
					}

					.clock{
						color:#74CDEA;
					}
					.clock-text{
						color:#838383;
					}
					.text-right{
						color:#838383;

					}

				}
			}
		}
	}
	.right{
		.avatar{
			width:90px;
			height:90px;
		}
		.panel{
			.panel-body{
				p{
					font-size:13px;
					margin-bottom:2px;
				}
			}
		}
	}
}

@media screen and (max-width:992px){
	.masthead{
		.avatar{
			width:100px;
			height:100px;
		}
		.banner{
			.left{
				text-align:center;
			}
		}
	}
}

@media screen and (max-width:1200px){
	.masthead{
		.avatar{
			width:120px;
			height:120px;
		}
		.banner{
			.left{
				text-align:center;
			}
		}
	}
}